<template>
  <div class="question-import-main">
    <div
      class="box_sentime_for"
      v-for="(item, index) in questionGroup"
      :key="index"
      :class="{
        childrenQuestionMark: item.childrenQuestionMark,
        hidden: item.hiddenDom,
      }"
    >
      <div class="question-title">
        <span class="box_content_top"
          >{{ item.index }}:{{ item.conditionName }}</span
        >
      </div>
      <div class="answer-container" style="margin-top: 20px">
        <!-- 第一题是复选题,所以这里做了v-if判断 -->
        <el-checkbox-group v-model="item.selectedId" v-if="index === 0">
          <el-checkbox
            v-for="answer in item.answers"
            @change="(val) => rootQuestionChange(val, answer, item)"
            :key="answer.id"
            :label="answer.id"
            >{{ answer.conditionName }}</el-checkbox
          >
        </el-checkbox-group>
        <el-radio-group
          v-model="item.selectedId"
          class="answer-radio"
          @change="(val) => answerChange(val, item, index)"
          v-else
        >
          <el-radio
            v-for="answer in item.answers"
            :label="answer.id"
            :key="answer.id"
            >{{ answer.conditionName }}</el-radio
          >
        </el-radio-group>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  data() {
    return {
      questionGroup: [],
      rootQuestionRelation: [],
      allQuestion: [],
      allAnswers: [],
    };
  },
  methods: {
    getQuestionsData() {
      const data = {
        "C-Response-Desc": "success",
        "C-API-Status": "00",
        "C-Response-Body": {
          ok: true,
          err: null,
          changes: null,
          pageIndex: null,
          pageCount: null,
          pageTotal: null,
          data: [
            {
              id: "7ead8f4f6f0e440aaec727fd5f528c83",
              catalogRelation:
                "130172059002,130172059003|130172059001|130172059005|130172059006",
              conditionList: [
                {
                  id: "00010398",
                  conditionName:
                    "您需要办理《药品经营许可证》（零售）的哪项业务？",
                  parentid: "0",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "2^1",
                  hasChild: "1",
                  catalogInfoId: null,
                  basicCode: null,
                  catalogName: null,
                  hasLink: null,
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010375",
                  conditionName: "该事项只有一种办理情形",
                  parentid: "00010374",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010382",
                  conditionName: "是",
                  parentid: "00010376",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010383",
                  conditionName: "否",
                  parentid: "00010376",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010384",
                  conditionName: "是",
                  parentid: "00010377",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010385",
                  conditionName: "否",
                  parentid: "00010377",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010386",
                  conditionName: "是",
                  parentid: "00010378",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010387",
                  conditionName: "否",
                  parentid: "00010378",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010388",
                  conditionName: "是",
                  parentid: "00010379",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010389",
                  conditionName: "否",
                  parentid: "00010379",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010390",
                  conditionName: "是",
                  parentid: "00010380",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010391",
                  conditionName: "否",
                  parentid: "00010380",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010392",
                  conditionName: "是",
                  parentid: "00010381",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010393",
                  conditionName: "否",
                  parentid: "00010381",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010395",
                  conditionName: "该事项只有一种办理情形",
                  parentid: "00010394",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010397",
                  conditionName: "该事项只有一种办理情形",
                  parentid: "00010396",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: "",
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
                {
                  id: "00010399",
                  conditionName: "药品经营许可核发",
                  parentid: "00010398",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "1",
                  hasChild: "1",
                  catalogInfoId: "130172059001",
                  basicCode: "130172059001",
                  catalogName: "《药品经营许可证》（零售）核发",
                  hasLink: "0",
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010400",
                  conditionName: "药品经营许可换发",
                  parentid: "00010398",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "1",
                  hasChild: "1",
                  catalogInfoId: "130172059002",
                  basicCode: "130172059002",
                  catalogName: "《药品经营许可证》（零售）换发",
                  hasLink: "0",
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010401",
                  conditionName: "药品经营许可变更",
                  parentid: "00010398",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "1",
                  hasChild: "1",
                  catalogInfoId: "130172059003",
                  basicCode: "130172059003",
                  catalogName: "《药品经营许可证》（零售）许可事项变更",
                  hasLink: "0",
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010402",
                  conditionName: "药品经营许可补发",
                  parentid: "00010398",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "1",
                  hasChild: "1",
                  catalogInfoId: "130172059006",
                  basicCode: "130172059006",
                  catalogName: "《药品经营许可证》（零售）补发",
                  hasLink: "0",
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010403",
                  conditionName: "药品经营许可注销",
                  parentid: "00010398",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "1",
                  hasChild: "1",
                  catalogInfoId: "130172059005",
                  basicCode: "130172059005",
                  catalogName: "《药品经营许可证》（零售）注销",
                  hasLink: "0",
                  linkUrl: null,
                  isSelect: "0",
                },
                {
                  id: "00010396",
                  conditionName: "该事项是否只有一种办理情形",
                  parentid: "00010399",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010374",
                  conditionName: "该事项是否只有一种办理情形",
                  parentid: "00010400",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010376",
                  conditionName: "您是否变更经营范围",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010377",
                  conditionName: "您是否变更注册地址",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010378",
                  conditionName: "您是否变更企业名称",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010379",
                  conditionName: "您是否变更质量负责人",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010380",
                  conditionName: "您是否变更企业负责人",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010381",
                  conditionName: "您是否变更法定代表人",
                  parentid: "00010401",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010406",
                  conditionName: "该事项是否只有一种办理情形",
                  parentid: "00010402",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010394",
                  conditionName: "该事项是否只有一种办理情形",
                  parentid: "00010403",
                  leadType: "0",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "1",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: null,
                },
                {
                  id: "00010407",
                  conditionName: "该事项只有一种办理情形",
                  parentid: "00010406",
                  leadType: "1",
                  groupId: "00010398",
                  sortcode: null,
                  conditionDesc: null,
                  channeliden: "",
                  hasChild: "0",
                  catalogInfoId: "",
                  basicCode: "",
                  catalogName: "",
                  hasLink: "",
                  linkUrl: "",
                  isSelect: "0",
                },
              ],
            },
          ],
          success: "1",
        },
        "C-Response-Code": "000000000000",
      };
      const res = data["C-Response-Body"];
      if (res.ok && res.data && res.data.length) {
        this.setNeedData(res.data[0]);
      }
    },
    setNeedData(qustions) {
      this.rootQuestionRelation = qustions.catalogRelation
        ? qustions.catalogRelation.split("|")
        : [];
      const allQuestion = qustions.conditionList.filter(
        (ele) => ele.leadType === "0"
      ); // 所有父级题
      const firstQuestion = allQuestion.filter(
        (ele) => !ele.parentid || ele.parentid === "0"
      ); // 需要的父级题
      const allAnswers = qustions.conditionList.filter(
        (ele) => ele.leadType === "1"
      ); // 所有子选项
      this.allQuestion = allQuestion;
      this.allAnswers = allAnswers;
      this.questionGroup = firstQuestion.map((ele, index) => {
        return {
          ...ele,
          answers: allAnswers.filter((item) => item.parentid === ele.id),
          index: index + 1,
          selectedId: [],
        };
      });
      console.log(this.allQuestion, this.allAnswers, this.questionGroup);
    },
  },
  created() {
    this.getQuestionsData();
    console.log(this.questionGroup);
  },
};
</script>

<style lang="scss">
.question-import-main {
  width: 100%;
  border-radius: 10px;
  padding: 10px 0;
  box-sizing: border-box;
  .box_sentime_for {
    font-family: Source Han Sans CN;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 130%;
    margin-bottom: 20px;
    &.childrenQuestionMark {
      //margin-left: 24px;
    }
    & + .box_sentime_for:not(.childrenQuestionMark) {
      border-top: 1px solid #eaeaea;
    }
    &.hidden {
      display: none;
    }
    .question-title {
      color: #666;
      font-size: 15px;
      font-weight: 500;
    }
    .answer-container {
      .el-checkbox__input.is-checked .el-checkbox__inner {
        background-color: #155ede;
        border-color: #155ede;
      }
      .el-radio__input.is-checked .el-radio__inner {
        background-color: #155ede;
        border-color: #155ede;
      }
      .el-checkbox__label,
      .el-radio__label {
        color: #666;
      }
    }
  }
  .el-radio__label {
    padding: 0px;
  }
  .el-radio {
    .el-radio__input {
      .el-radio__inner {
        width: 15px;
        height: 15px;
        margin-right: 8px;
      }
    }
    .el-radio__label {
      white-space: pre-line;
    }
  }
  .box_content_top {
    font-family: Source Han Sans CN;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 130%;
    color: #181818;
    margin-bottom: 20px;
  }
  .el-radio__label {
    font-family: Source Han Sans CN;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 130%;
    color: #181818;
  }
  .has-gutter {
    tr {
      .el-table_1_column_1 {
        width: 1000px;
      }
    }
  }
  .box_according {
    .box-fishh {
      font-family: Source Han Sans CN;
      font-style: normal;
      font-weight: bold;
      font-size: 16px;
      line-height: 130%;
      color: #515b6e;
      margin-top: 40px;
      margin-bottom: 20px;
    }
  }
}
</style>
